import {Layout} from '../../../src/Layout';
export default Layout;

import '../../../tailwind/tailwind.css';

import App from './plants/App';
import {ExampleApp} from '../../../src/ExampleApp';
import {ComponentList} from '../../../src/ComponentCard';

export const hideNav = true;
export const isSubpage = true;
export const section = 'Examples';
export const keywords = ['react-aria', 'example', 'table', 'search', 'filters', 'taggroup', 'actions', 'form', 'menu', 'popover', 'searchfield', 'dropzone', 'crud'];
export const description = 'Table with search, filters, column resizing, and form validation.';

# Filterable CRUD Table

<PageDescription>A plant tracking app with CRUD operations, search, filters, table column resizing, form validation, and more.</PageDescription>

<App />

<ExampleApp dir="packages/dev/s2-docs/pages/react-aria/examples/plants" defaultSelected="App.tsx" type="tailwind" />

## Components

<ComponentList
  pages={props.pages}
  components={[
    'react-aria/Button',
    'react-aria/Checkbox',
    'react-aria/ComboBox',
    'react-aria/DatePicker',
    'react-aria/DropZone',
    'react-aria/Form',
    'react-aria/GridList',
    'react-aria/Menu',
    'react-aria/Modal',
    'react-aria/Popover',
    'react-aria/SearchField',
    'react-aria/Select',
    'react-aria/Table',
    'react-aria/TagGroup',
    'react-aria/TextField',
    'react-aria/ToggleButton',
    'react-aria/Tooltip'
  ]} />
